<template>
	<PageWrapper dense contentFullHeight contentClass="flex">
		<RouteTree class="w-1/4 xl:w-1/5" @select="handleSelect" />
		<BasicTable @register="registerTable" class="w-3/4 xl:w-4/5" :searchInfo="searchInfo">
			<template #toolbar>
				<a-button type="primary" danger>批量生成</a-button>
			</template>
			<template #bodyCell="{column,  record }">
				<template v-if="column.key === 'action'">
					<TableAction :actions="[
						{
							icon: 'ant-design:vertical-align-bottom-outlined',
							label: '代码生成',
							onClick: genCode.bind(null, record)
						}
					]" />
				</template>
			</template>
		</BasicTable>
	</PageWrapper>
</template>
<script lang="ts" setup>
	import { reactive } from 'vue';
	// 引入基础组件
	import { PageWrapper } from '/@/components/Page';
	import { BasicTable, useTable, TableAction } from '/@/components/Table';
	// 插入数据内容
	import { columns, searchFormSchema } from './api.data';
	import { useDrawer } from '/@/components/Drawer';
	import { useMessage } from '/@/hooks/web/useMessage';
	import RouteTree from './DataSourceTree.vue';
	import { tableListBySchema } from '/@/api/system/datasource';
	const { createMessage } = useMessage();
	const searchInfo = reactive<Recordable>({});

	const [registerDrawer, { openDrawer }] = useDrawer();
	const [registerTable, { reload }] = useTable({
		title: '数据表',
		api: tableListBySchema,
		columns,
		formConfig: {
			labelWidth: 80,
			baseColProps: { span: 24 },
			schemas: searchFormSchema
		},
		immediate: false,
		useSearchForm: true,
		showTableSetting: true,
		bordered: true,
		showIndexColumn: true,
		actionColumn: {
			width: 120,
			title: '操作',
			dataIndex: 'action',
		}
	});

	function handleSelect(node) {
		searchInfo.queryParams = {
			F_id_eq: node.id,
			schemaName: node.schema
		};
		reload();
	}

	function genCode(record : Recordable) {

	}


	function handleSuccess() {
		reload();
	}
</script>